
import { IComponent } from '@umijs/renderer-react'
import { Button } from 'antd'
import { FC, useContext } from 'react'
import { IContent, Itodo } from './data'
import { Content } from './prvoider'
interface ITtemProps {
  data: Itodo
}
const Item: FC<ITtemProps> = ({ data }) => {
  const { removeTodo, toggleTodo } = useContext(Content) as IContent
  const { value, completed, id } = data
  return (
    <div style={{ display: 'flex' }}>
      <p>{value}</p>
      <input type='checkbox' checked={completed} onChange={() => { toggleTodo(id) }} />
      <Button type='primary' onClick={() => { removeTodo(id) }}>dele</Button>
    </div>
  )
}

export default Item